<div class="toast-notifications-list-pf">
  <div
    ng-repeat="(notificationID, notification) in notifications track by notification.trackByID"
    ng-if="!notification.hidden || notification.isHover"
       ng-mouseenter="setHover(notification, true)" ng-mouseleave="setHover(notification, false)">
    <div class="toast-pf alert {{notification.type | alertStatus}}" ng-class="{'alert-dismissable': !hideCloseButton}">
      <button ng-if="!hideCloseButton" type="button" class="close" ng-click="close(notification)">
        <span class="pficon pficon-close" aria-hidden="true"></span>
        <span class="sr-only">Close</span>
      </button>
      <span class="{{notification.type | alertIcon}}" aria-hidden="true"></span>
      <span class="sr-only">{{notification.type}}</span>
      <span class="toast-notification-message" ng-if="notification.message">{{notification.message}}</span>
      <div ng-if="notification.details" class="toast-notification-details">
        <truncate-long-text
          limit="200"
          content="notification.details"
          use-word-boundary="true"
          expandable="true"
          hide-collapse="true">
        </truncate-long-text>
      </div>
      <span ng-repeat="link in notification.links">
        <a ng-if="!link.href" href="" ng-click="onClick(notification, link)" role="button">{{link.label}}</a>
        <a ng-if="link.href" ng-href="{{link.href}}" ng-attr-target="{{link.target}}">{{link.label}}</a>
        <span ng-if="!$last" class="toast-action-divider">|</span>
      </span>
    </div>
  </div>
</div>
